<template>
    <div class="content">
        <el-row class="enterprise_info hpx-title-border enterprise_info_int">
            <el-col :span="6">
                <span class="hpx-label">报价机构：</span>
                <!--@input="inputAcceptEnterprise"-->
                <el-input size="small" type="text" class="contactName" placeholder="请输入报价机构" v-model="filterForm.enterpriseName" @input="inputAcceptEnterprise"></el-input>
                <div class="tableRed err_msg_text">{{this.errMsgText}}</div>
                <Select :data="enterpriseList" @select-item="selectItem" v-if="isShowEnterprise"/>
            </el-col>
            <el-col :span="6">
                <span class="hpx-label">联系人：</span>
                <el-input size="small" type="text" class="contactName" placeholder="请输入联系人姓名" autofocus v-model="filterForm.contactName"></el-input>
            </el-col>
            <el-col :span="12">
                <span class="hpx-label">联系方式：</span>
                <el-input size="small" type="text" class="contactName" placeholder="请输入联系方式" autofocus v-model="filterForm.contactPhone" maxlength="11"></el-input>
            </el-col>
        </el-row>
        <el-form ref="filterForm" :model="filterForm" label-width="120px" :rules="rules" size="small" class="wantBill_condition">
            <el-row>
                <el-form-item label="票据类型：">
                    <el-radio-group v-model="filterForm.billType" size="small" @change="changeBillType">
                        <el-radio-button v-for="item in billTypes" :label="item.key" :key="item.key">{{item.label}}</el-radio-button>
                    </el-radio-group>
                </el-form-item>
            </el-row>
            <el-row>
                <el-col :span="10">
                    <el-form-item label="票面金额：" prop="billSumPriceStart">
                        <el-col :span="8">
                            <el-input type="number" v-model="filterForm.billSumPriceStart" placeholder="请输入(万元)"></el-input>
                        </el-col>
                        <el-col :span="1" class="hpx-label">——</el-col>
                        <el-col :span="8">
                            <el-input type="number" v-model="filterForm.billSumPriceEnd" placeholder="请输入(万元)"></el-input>
                        </el-col>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="每十万扣：" prop="billEveryPlus">
                        <el-col :span="8">
                            <el-input type="number" v-model="filterForm.billEveryPlus" placeholder="请输入(万元)"></el-input>
                        </el-col>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="10">
                    <el-form-item label="求购数量：" prop="number">
                        <el-col :span="8">
                            <el-input type="number" v-model="filterForm.number" placeholder="请输入求购数量(张)"></el-input>
                        </el-col>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="到期时间：">
                        <el-col :span="6">
                            <el-select v-model="filterForm.termType" :disabled="filterForm.billType == 102" @change="changeTermType" placeholder="请选择">
                                <el-option
                                        v-for="item in termType"
                                        :key="item.key"
                                        :label="item.label"
                                        :value="item.key">
                                </el-option>
                            </el-select>
                        </el-col>
                        <el-col :span="18">
                            <el-date-picker
                                    v-model="filterForm.time_interval"
                                    type="daterange"
                                    start-placeholder="开始日期"
                                    end-placeholder="结束日期"
                                    size="small"
                                    format="yyyy-MM-dd"
                                    unlink-panels
                                    :default-time="['00:00:00', '23:59:59']">
                            </el-date-picker>
                        </el-col>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-form-item label="承兑机构：">
                    <el-checkbox-group v-model="acceptType" size="small" @change="changeAcceptType()">
                        <el-checkbox-button v-for="item in acceptOptions" :label="item.key" :key="item.key">{{item.label}}</el-checkbox-button>
                    </el-checkbox-group>
                </el-form-item>
            </el-row>
            <el-row>
                <el-form-item label="瑕疵接受：">
                    <el-radio-group v-if="filterForm.billType == 101" v-model="filterForm.falwRequire" size="small">
                        <el-radio-button v-for="item in flaws" :label="item.key" :key="item.key">{{item.label}}</el-radio-button>
                    </el-radio-group>
                    <el-radio-group v-if="filterForm.billType == 102" v-model="filterForm.falwRequire" size="small">
                        <el-radio-button v-for="item in flaws_paper" :label="item.key" :key="item.key">{{item.label}}</el-radio-button>
                    </el-radio-group>
                </el-form-item>
            </el-row>
            <el-row>
                <el-form-item label="账户状态：">
                    <el-radio-group v-model="filterForm.customerStatus" size="small">
                        <!--:disabled="filterForm.customerStatus !=null"-->
                        <el-radio-button v-for="item in cusromerStatus" :label="item.key" :key="item.key">{{item.label}}</el-radio-button>
                    </el-radio-group>
                </el-form-item>
            </el-row>
            <el-row class="remarks">
                <span style="width: 120px;text-align: right;padding-right: 10px;">原始报价：</span>
                <el-input type="textarea" v-model="filterForm.remark" placeholder="请输入其他需要特别说明的求购信息(200字以内)"></el-input>
            </el-row>
            <el-row class="btn_center submit-btn">
                <el-button size="small" type="info" class="hpx-cancel-color dialog-button" @click="closePublish()">取消</el-button>
                <el-button size="small" type="primary" class="dialog-button" @click="publish('filterForm')">发布</el-button>
            </el-row>
        </el-form>
    </div>
</template>

<script lang="ts">
    import { Vue, Component } from 'vue-property-decorator';
    import moment from 'moment'
    import Select from '@component/common/Select.vue';
    import { mapGetters, mapState } from 'vuex';
    import { dateAdd } from '@/util/format'
    import { wantBillTypes, acceptorTypes, wantFlawsIdTypes, wantFlawsIdPaperTypes, wantCusromerStatusTypes, wantBillTermTypes } from '@/util/constantStatus'
    import { checkPhoneRex } from '@/util/format'
    @Component({
        components: {
            Select
        }
    })
    export default class NewWantBill extends Vue {
        isEditName = false
        isEditPhone = false
        isErrorMsg: boolean = false
        errMsgText: string = ''
        isEditInfo: boolean = false
        //筛选条件
        acceptType = ['']
        filterForm = {
            enterpriseId: '',
            enterpriseName: '',
            contactName: '',
            contactPhone: '',
            billType: 101,
            bankType: '',
            billSumPriceStart: '',
            billSumPriceEnd: '',
            billEveryPlus: '',
            number: '',
            deadlineDayStart: '',
            deadlineDayEnd: '',
            min_dead_date: '',
            max_dead_date: '',
            time_interval: [dateAdd('m',11,dateAdd("d", 15, new Date())),dateAdd('m',12,new Date())],
            falwRequire: '1500',
            customerStatus: 0,
            remark: '',
            termType: '2'
        }

        enterpriseList: any = []
        isShowEnterprise: boolean = false;
        // 选择企业
        selectItem (item) {
            this.isShowEnterprise = false
            this.filterForm.enterpriseName = item.enterprise_name;
            this.filterForm.enterpriseId = item.id;
        }
        // 输入企业
        inputAcceptEnterprise () {
            if (this.filterForm.enterpriseName) {
                this.getEnterpriseList()
            }
        }
        async getEnterpriseList () {
            let res = await this.$http.get(`customers/enterprise/queryEnterpriseByName?enterpriseName=${this.filterForm.enterpriseName}`)
            if (res.status == 200) {
                if (res.data != '') {
                    this.enterpriseList = res.data;
                    this.isShowEnterprise = true;
                    this.errMsgText = '';
                } else {
                    this.isErrorMsg = true
                    this.errMsgText = '未找到相关企业';
                }
            }
        }


        rules = {}
        //筛选按钮
        billTypes = wantBillTypes;
        acceptOptions = acceptorTypes;
        flaws = wantFlawsIdTypes;
        flaws_paper = wantFlawsIdPaperTypes;
        cusromerStatus = wantCusromerStatusTypes;
        termType = wantBillTermTypes;
        p(s) {
            return s < 10 ? '0' + s: s;
        }
        //切换票据类型
        changeBillType () {
            if(this.filterForm.billType == 102){
                this.filterForm.termType = '1'
                this.filterForm.time_interval = [dateAdd('m',5,dateAdd("d", 15, new Date())),dateAdd("m", 6, new Date())]
            }else{
                if(this.filterForm.termType == '1'){
                    this.filterForm.time_interval = [dateAdd('m',5,dateAdd("d", 15, new Date())),dateAdd("m", 6, new Date())]
                }else if(this.filterForm.termType == '2'){
                    this.filterForm.time_interval = [dateAdd('m',11,dateAdd("d", 15, new Date())),dateAdd("m", 12, new Date())]
                }else{
                    this.filterForm.time_interval = [new Date(),dateAdd("m", 12, new Date())]
                }
            }
        }
        //切换到期时间
        changeTermType () {
            if(this.filterForm.termType == '1'){
                this.filterForm.time_interval = [dateAdd('m',5,dateAdd("d", 15, new Date())),dateAdd("m", 6, new Date())]
            }else if(this.filterForm.termType == '2'){
                this.filterForm.time_interval = [dateAdd('m',11,dateAdd("d", 15, new Date())),dateAdd("m", 12, new Date())]
            }else{
                this.filterForm.time_interval = [new Date(),dateAdd("m", 12, new Date())]
            }
        }
        //切换承兑机构
        changeAcceptType () {
            if(this.acceptType[this.acceptType.length-1] == ''){
                this.acceptType = ['']
            }else{
                if(this.acceptType.indexOf('')>-1){
                    this.acceptType.splice(this.acceptType.indexOf(''),1)
                }
            }
        }
        //发布
        async publish (filterForm) {
            if (!this.filterForm.enterpriseName) {
                this.$alert('请输入报价机构!','提示',{
                    confirmButtonText: '确定',
                    customClass: 'custom-message-box',
                    callback: action => {}
                })
                return;
            }
            if (!this.filterForm.enterpriseId || this.filterForm.enterpriseId == '' || this.filterForm.enterpriseId == null || this.filterForm.enterpriseId == undefined) {
                this.$alert('请输入正确的机构!','提示',{
                    confirmButtonText: '确定',
                    customClass: 'custom-message-box',
                    callback: action => {}
                })
                return;
            }
            if (!this.filterForm.contactName) {
                this.$alert('请输入联系人!','提示',{
                    confirmButtonText: '确定',
                    customClass: 'custom-message-box',
                    callback: action => {}
                })
                return;
            }
            if (!this.filterForm.contactPhone) {
                this.$alert('请输入联系方式!','提示',{
                    confirmButtonText: '确定',
                    customClass: 'custom-message-box',
                    callback: action => {}
                })
                return;
            }
            if (!checkPhoneRex(this.filterForm.contactPhone)) {
                this.$alert('请输入正确的联系方式!','提示',{
                    confirmButtonText: '确定',
                    customClass: 'custom-message-box',
                    callback: action => {}
                })
                return;
            }
            if(!this.filterForm.billSumPriceStart || !this.filterForm.billSumPriceEnd){
                this.$alert('请输入票面金额','提示',{
                    confirmButtonText: '确定',
                    customClass: 'custom-message-box'
                })
                return false
            }
            if(!this.filterForm.billEveryPlus){
                this.$alert('请输入每十万扣','提示',{
                    confirmButtonText: '确定',
                    customClass: 'custom-message-box'
                })
                return false
            }
            if(!this.filterForm.number){
                this.$alert('请输入求购数量','提示',{
                    confirmButtonText: '确定',
                    customClass: 'custom-message-box'
                })
                return false
            }
            this.filterForm.enterpriseId = this.filterForm.enterpriseId
            this.filterForm.bankType = this.acceptType.join(',')
            this.filterForm.deadlineDayStart = moment(this.filterForm.time_interval[0]).format('YYYY-MM-DD')
            this.filterForm.deadlineDayEnd = moment(this.filterForm.time_interval[1]).format('YYYY-MM-DD')
            let res = await this.$http.post('pcc/admin/addWantBill',this.filterForm)
            if(res.status == 200){
                this.$router.push('/trade/wantBill')
            }
        }
        // 取消发布
        closePublish () {
            this.$router.push('/trade/wantBill')
        }
        mounted () {

        }
    }
</script>

<style lang="scss" scoped>
    .enterprise_info{
        height: 50px;
        line-height: 50px;
        font-size: $__font-size-default;
        background: $__color-bg-unimportance;
        .title_text{
            margin-left: 10px;
        }
        .col{
            margin-left: 50px;
        }
        .col:first-child{
            margin-left: 10px;
        }
        /*.contactName{*/
            /*width: 200px;*/
        /*}*/
        .editBtn{
            cursor: pointer;
        }
    }
    .wantBill_condition{
        padding-top: 18px;
    }
    .remarks {
        display: flex;
        span{
            width: 106px;
            text-indent: 14px;
            font-size: 16px;
        }
    }
    .btn_center{
        padding: 20px 0;
        text-align: center;
    }
    .content {
        margin-top: 8px;
    }
    .enterprise_info_int {
        .el-input {
            width: 320px;
        }
    }
</style>